{% extends 'base.html' %}

{% block head_title %}Change password{% endblock head_title %}

{% block content %}
<div class="container">
  <div class="row">
    <div class="col-7">
      <h2 class=" my-5">Change password</h2>
      <form method="post">
        {% csrf_token %}
        <div class="form-group">
          {{ form.old_password.label_tag }}
          <input type="password" class="form-control {% if form.old_password.errors %}is-invalid{% endif %}"
            id="id_old_password" name="old_password" value='{{ form.old_password.value|default:"" }}'>
          {% if form.old_password.errors %}
          <div class="invalid-feedback">{{ form.old_password.errors }}</div>
          {% endif %}
        </div>
        <div class="form-group">
          {{ form.new_password1.label_tag }}
          <input type="password" class="form-control {% if form.new_password1.errors %}is-invalid{% endif %}"
            id="id_new_password1" name="new_password1" value='{{ form.new_password1.value|default:"" }}'>
          {% if form.new_password1.errors %}
          <div class="invalid-feedback">{{ form.new_password1.errors }}</div>
          {% endif %}
          <small class="text-muted">{{ form.new_password1.help_text }}</small>
        </div>
        <div class="form-group">
          {{ form.new_password2.label_tag }}
          <input type="password" class="form-control {% if form.new_password2.errors %}is-invalid{% endif %}"
            id="id_new_password2" name="new_password2" value='{{ form.new_password2.value|default:"" }}'>
          {% if form.new_password2.errors %}
          <div class="invalid-feedback">{{ form.new_password2.errors }}</div>
          {% endif %}
        </div>
        <button type="submit" class="btn btn-primary">Change password</button>
    </div>
  </div>
</div>
{% endblock content %}